import { ref } from 'vue'
import { defineStore } from 'pinia'
import { loginUserRequest, menusRequest } from '@/api/user-api'

export const usePermissionStore = defineStore(
    'permission', // 这里是存储的关键字，可以在浏览器应用存储中看到
    () => {
        // 当前用户
        const loginUser = ref({})

        // 登录状态，会话对象
        const session = ref({});

        // 通过请求登录用户信息更新loginUser
        const getLoginUser = () => {
            return loginUserRequest()
                .then(res => {
                    if (res.code === 200) {
                        // 更新登录用户信息
                        loginUser.value = res.data.loginUser
                        // 更新会话对象
                        session.value = res.data.session
                    }
                })
        }

        // 完整的菜单权限示例,实际通过服务端接口获取
        const menuListDemo = [
            {
                name: '主页',
                path: 'default',
                type: 'C',
                component: 'Index'
            },
            {
                name: '课程设计',
                path: 'case',
                type: 'M',
                children: [
                    {
                        name: '书籍管理',
                        path: 'books',
                        type: 'C',
                        component: 'case/Books'
                    },
                    {
                        name: '文件列表',
                        path: 'files',
                        type: 'C',
                        component: 'case/Files'
                    },
                    {
                        name: '实时天气',
                        path: 'weathers',
                        type: 'C',
                        component: 'case/Weathers'
                    },
                ]
            },
            {
                name: '系统管理',
                path: 'system',
                type: 'M',
                children: [
                    {
                        name: '用户管理',
                        path: 'users',
                        type: 'C',
                        component: 'system/Users'
                    },
                    {
                        name: '角色管理',
                        path: 'roles',
                        type: 'C',
                        component: 'system/Roles'
                    },
                    {
                        name: '菜单管理',
                        path: 'menus',
                        type: 'C',
                        component: 'system/Menus'
                    },
                ]
            },
            {
                name: '系统设置',
                path: 'settings',
                type: 'C',
                component: 'Settings'
            }
        ]

        // home的子路由示例
        const routerListDemo = [
            {
                path: '/home/default',
                title: '主页',
                name: 'default'
            },
            {
                path: '/home/books',
                title: '书籍管理',
                name: 'default',
            },
            {
                path: '/home/files',
                title: '文件列表',
                name: 'default'
            },
            {
                path: '/home/weathers',
                title: '实时天气',
                name: 'default',
            },
            {
                path: '/home/users',
                title: '用户管理',
                name: 'default'
            },
            {
                path: '/home/roles',
                title: '角色管理',
                name: 'default'
            },
            {
                path: '/home/menus',
                title: '菜单管理',
                name: 'default'
            },
            {
                path: '/home/settings',
                title: '系统设置',
                name: 'default'
            }
        ]

        // 定义空数组，存放当前用户的菜单信息
        const menuList = ref([])
        // 定义空数组，存放当前用户可以访问的tab
        const routerList = ref([])
        // 定义空数组，存放当前用户可以访问的path
        const pathList = ref([])

        // 根据接口结果生成home子路由数组的方法
        const setRouterList = routers => {
            // 上一个用户退出登录后，不刷新页面，即使session中清除存储，内存中的变量仍然是有值的
            // 先恢复内存中的变量值为空数组
            routerList.value = []
            if (routers) {
                routers.forEach(router => {
                    routerList.value.push({
                        path: '/home/' + router.path,
                        title: router.name,
                        name: router.path
                    })
                });
            }
        }

        // 根据接口结果生成path数组的方法
        const setPathList = data => {
            // 上一个用户退出登录后，不刷新页面，即使session中清除存储，内存中的变量仍然是有值的
            // 先恢复内存中的变量值为空数组
            pathList.value = []
            if (data) {
                data.forEach(path => pathList.value.push('/home/' + path))
            }
        }

        // 通过请求权限菜单更新menuList、routerList、pathList
        const getMenus = () => {
            // 发请求
            return menusRequest().then(res => {
                if (res.code === 200) {
                    // 更新菜单数据
                    menuList.value = res.data.menus
                    // 更新路由数据
                    setRouterList(res.data.routers)
                    // 更新path数据
                    setPathList(res.data.paths)
                }
            })
        }

        // 恢复默认
        const resume = () => {
            // 清除登录用户
            loginUser.value = {}
            // 清除登录信息
            session.value = {}
            // 清除menuList
            menuList.value = []
            // 清除routerList
            routerList.value = []
            // 清除pathList
            pathList.value = []
        }

        return { loginUser, session, getLoginUser, menuList, routerList, pathList, getMenus, resume }
    },
    {
        persist: {
            enabled: true,
            strategies: [
                {
                    // 使用sessionStorage进行持久化，与登录凭证token保存方式一致
                    storage: sessionStorage // 其默认的存储方式也是sessionStorage
                }
            ]
        }
    }
)